<template>
  <!-- 公示信息表单 -->
  <div style="margin-top: 20px">
    <div style="text-align: center">
      <h3>填写公示信息</h3>
    </div>
    <!-- 基础信息公示-->

    <!-- 公示学况信息 -->
    <div style="border: 1px solid black; width: 60vw; margin-left: 20vw">
      <div class="gongshi">学况信息</div>
      <el-form ref="form" :model="form" label-width="130px">
        <el-form-item label="考试名称">
          <el-input
            v-model="form.examination_name"
            placeholder="例：第一次模拟考"
          ></el-input>
        </el-form-item>
        <el-form-item label="学生所处学段">
          <el-cascader :options="learning_section" clearable></el-cascader>
        </el-form-item>
        <el-form-item label="考试成绩">
          <el-input v-model="form.score"></el-input>
        </el-form-item>
        <el-form-item label="班级排名">
          <el-input v-model="form.Class_Ranking"></el-input>
        </el-form-item>
      </el-form>
    </div>
    <!-- 公示获奖信息 -->
    <div style="border: 1px solid black; width: 60vw; margin-left: 20vw">
      <div class="gongshi">获奖信息</div>
      <el-form ref="form" :model="form" label-width="130px">
        <el-form-item label="获奖名称">
          <el-input v-model="form.award_name"></el-input>
        </el-form-item>
        <el-form-item label="获奖时间">
          <el-input v-model="form.award_time"></el-input>
        </el-form-item>
        <el-form-item label="奖状图片">
          <el-upload
            class="upload-demo"
            drag
            action="https://jsonplaceholder.typicode.com/posts/"
            multiple
          >
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">
              将文件拖到此处，或<em>点击上传</em>
            </div>
            <div class="el-upload__tip" slot="tip">
              只能上传jpg/png文件，且不超过500kb
            </div>
          </el-upload>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">提交</el-button>
          <el-button @click="resetForm('form')">重置</el-button>
          <el-button>返回</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      form: {
        donation_information_id: "",
        learning_school: "",
        Political_Outlook: "",
        birthday: "",
        age: "",
        examination_name: "",
        score: "",
        Class_Ranking: "",
      },
      learning_section: [
        {
          value: "xioaxue",
          label: "小学",
          children: [
            {
              value: "yinianji",
              label: "一年级",
            },
            {
              value: "ernianji",
              label: "二年级",
            },
            {
              value: "sannianji",
              label: "三年级",
            },
            {
              value: "sinianji",
              label: "四年级",
            },
            {
              value: "wunianji",
              label: "五年级",
            },
            {
              value: "liunianji",
              label: "六年级",
            },
          ],
        },
        {
          value: "chuzhong",
          label: "初中",
          children: [
            {
              value: "chuyi",
              label: "初一",
            },
            {
              value: "chuer",
              label: "初二",
            },
            {
              value: "chusan",
              label: "初三",
            },
          ],
        },
        {
          value: "gaozhong",
          label: "高中",
          children: [
            {
              value: "gaoyi",
              label: "高一",
            },
            {
              value: "gaoer",
              label: "高二",
            },
            {
              value: "gaosan",
              label: "高三",
            },
          ],
        },
        {
          value: "daxue",
          label: "大学",
          children: [
            {
              value: "dayi",
              label: "大一",
            },
            {
              value: "daer",
              label: "大二",
            },
            {
              value: "dasan",
              label: "大三",
            },
            {
              value: "dasi",
              label: "大四",
            },
          ],
        },
        {
          value: "qita",
          label: "其他",
        },
      ],
    };
  },
  methods: {
    onSubmit() {
      this.$router.push({
        path: "../charity/feedbackform",
        // query: { id: id },
      });
    },
    resetForm(formName) {
      console.log("resetForm");
      this.$refs[formName].resetFields();
    },
  },
};
</script>
<style scoped>
.gongshi {
  width: 80px;
  margin-top: -10px;
  margin-left: 30px;
  background-color: rgb(254, 245, 230);
}
.el-input__inner {
  width: 30vw;
}
</style>
